<template>
  <div>
    <return-before title="主播" />
    <people :items="data" @click="onImgClick" />
  </div>
</template>

<script>
import people from "./ui/people.vue";
import { getMusicApi } from "../../api/musicApi";
export default {
  components: {
    people,
  },
  data() {
    return {
      data: [],
    };
  },
  async beforeCreate() {
    let music = await getMusicApi();
    this.data = music;
  },
  methods: {
    async onImgClick(row) {
      // 这里别忘了注释
      // console.log(row);
      // console.log(row);
      // 现在问题是怎么把这个row传给其他文件，跨层级要怎么传
      // this.$globalEvent.$emit('custom-event', row);
      let code = await this.$store.dispatch("musicbook/musicBookAction", row);
      // console.log(111);

      if (code == 0) {
        // console.log(222);
        this.$router.push(`/drama/${row.id}`);
        // 这里使用缓存存储数据
        localStorage.setItem("booklMusic",JSON.stringify(row))
      }
      // console.log(333);
      console.log(row);
    },
  },
};
</script>

<style lang="scss" scoped></style>
